<template>
	<view class="content">
		<view style="height: 14rpx;background: #EDEDED;"></view>
		<view class="head">
			<view :class="{ time: index == 0 }" @click="tbs">时间管理</view>
			<view :class="{ time: index == 1 }" @click="tbs_now">今日预约</view>
		</view>
		<!-- //时间管理 -->
		<view v-if="index == 0">
			<view class="xx">
				<uni-calendar :lunar="false" @change="changed" :showMonth="false" @monthSwitch="closeBox()"></uni-calendar>
				<view class="bb" v-if="hide">
					<view class="week_day">
						<view v-for="(item,index) in list" :key='index' @click="getDay(item.years,index,item)" :class="{icons:active==index}">
							<view>{{item.day}}</view>
							<view :class="{icon_time:active==index,week_time:true} ">{{item.years_more}}</view>
						</view>
					</view>
					<view class="infors">
						<view  v-for="(item,index) in AppointmentList" :key="index" :class="{boxs:true,active:item.status=='可预约'}" @click="close(item)">
							<view>{{item.times}}</view>
							<view>{{item.status}}</view>
						</view>
						<view class="bott">
							<view class="tishi">温馨提示</view>
							<view class="text">做好预约时间安排，避免预约等位和影响顾客体验。</view>
						</view>
					</view>
					
					
				
				</view>
				
			</view>

			<view style="height: 14rpx;background: #EDEDED;"></view>
			
			
			<view v-if="hide1">
				<view class="uni-list-cell uni-list-cell-pd">
					<view class="uni-list-cell-db lis">店铺接单开启</view>
					<switch :checked="checked" color="#00C6C2" style="transform: scale(0.7);"  @change="switchChange"/>
					
				</view>
				
				<view class="uni-list-cell uni-list-cell-pd">
					<view class="uni-list-cell-db lis">店铺接单开启</view>
					<view>
						<text
							style="
					font-size: 28rpx;
					font-family: PingFang SC;
					font-weight: 400;
					color: #ADADAD;"
							@click="pick"
						>
							{{ tim }} >
						</text>
					</view>
					<u-picker mode="multiSelector" v-model="show" :default-selector="[0, 1]" :range="multiSelector" @confirm="getItem" :disabled='true'></u-picker>
					<!-- <switch checked color="#00C6C2" style="transform: scale(0.7);" /> -->
				</view>
				
				<view class="uni-list-cell uni-list-cell-pd">
					<view class="uni-list-cell-db lis">公休息日设定</view>
					<view>
						<text
							style="
					font-size: 28rpx;
					font-family: PingFang SC;
					font-weight: 400;
					color: #ADADAD;"
							@click="pick2"
						>
							{{ text }}
						</text>
					</view>
					<u-picker mode="selector" v-model="show1" :range="lists" @confirm="getItem2"></u-picker>
					<!-- <switch checked color="#00C6C2" style="transform: scale(0.7);" /> -->
				</view>
				<view class="footer">
					<!-- //保存按钮 -->
					<view class="save" @click="save"><text style="opacity: 0.7;">保存</text></view>
				</view>
			</view>
			
		</view>
	
		
		<!-- //今日预约 -->
		<view v-if="index == 1" class="now_time">
			<view class="week_day">
				<view v-for="(item,index) in list" :key='index' @click="getDay(item.years,index,item)" :class="{icons:active==index}">
					<view>{{item.day}}</view>
					<view :class="{icon_time:active==index,week_time:true} ">{{item.years_more}}</view>
				</view>
			</view>
			<view class="infors">
				<view  v-for="(item,index) in AppointmentList" :key="index" :class="{boxs:true,active:item.status=='可预约'}" @click="close(item)">
					<view>{{item.times}}</view>
					<view>{{item.status}}</view>
				</view>
				<view class="bott">
					<view class="tishi">温馨提示</view>
					<view class="text">做好预约时间安排，避免预约等位和影响顾客体验。</view>
				</view>
			</view>
			
			
			
		</view>
		<view v-if="hide3">
			<!-- 今日预约 -->
			<view class="list" v-for="(item,index) in detailList2" :key='item.id'>
				<view class="list_top">
					<view class="list_left">
						<view class="left_top">今天 {{item.orderCreateTime|getHours()}}  {{item.introduceDetails}}·{{item.userNumber}}人  <!-- <text class="upTime">修改时间</text> --></view>
						<view>
							<text class="scrail1"></text><text class="public">服务:</text><text class="public_text">{{item.introduceDetails}} </text>
						</view>
						<view>
							<text class="scrail2"></text><text class="public">用时:</text><text class="public_text">预计{{item.estimatedTime}}小时 </text>
						</view>
					</view>
					<view class="list_right">
						<view @click="call(item.userPhone)"><text class="icon iconfont">&#xe63e;</text></view>
						<view><text class="log">￥</text><text class="price">{{item.orderPayAmount}}</text></view>
					</view>
				</view>
			
				<view class="list_botom">
					<view class="list-bot-left">
						<view class="imgs">
							<u-avatar :src="item.technicianPhoto"
							level-icon='man'
							size="70"
							mode="circle"
							sex-icon="woman"
							show-sex ="true"
							
							></u-avatar>
						</view>
			
						<view class="list-con">
							<view class="list-con-top">
								<text>{{item.technicianName}}</text>
								<text class="mei">美VIP</text>
								<text class="shi">实名认证</text>
							</view>
							<view class="list-con-bot">
								<text>预约{{item.technicianNumberCount}}次</text>|
								<text>好评{{item.technicianScore}}分</text>
							</view>
						</view>
					</view>
					
					<view class="right-list">
						<text class="right-list-text1" @click="cancel(index)">取消</text>
						<text class="right-list-text2">接单</text>
					</view>
				</view>
			</view>
		</view>
		<view v-if="hide2">
			<view class="list" v-for="(item,index) in detailList" :key='item.id'>
				<view class="list_top">
					<view class="list_left">
						<view class="left_top">今天 {{item.orderCreateTime|getHours()}}  {{item.introduceDetails}}·{{item.userNumber}}人  <!-- <text class="upTime">修改时间</text> --></view>
						<view>
							<text class="scrail1"></text><text class="public">服务:</text><text class="public_text">{{item.introduceDetails}} </text>
						</view>
						<view>
							<text class="scrail2"></text><text class="public">用时:</text><text class="public_text">预计{{item.estimatedTime}}小时 </text>
						</view>
					</view>
					<view class="list_right">
						<view @click="call(item.userPhone)"><text class="icon iconfont">&#xe63e;</text></view>
						<view><text class="log">￥</text><text class="price">{{item.orderPayAmount}}</text></view>
					</view>
				</view>
			
				<view class="list_botom">
					<view class="list-bot-left">
						<view class="imgs">
							<u-avatar :src="item.technicianPhoto"
							level-icon='man'
							size="70"
							mode="circle"
							sex-icon="woman"
							show-sex ="true"
							
							></u-avatar>
						</view>
			
						<view class="list-con">
							<view class="list-con-top">
								<text>{{item.technicianName}}</text>
								<text class="mei">美VIP</text>
								<text class="shi">实名认证</text>
							</view>
							<view class="list-con-bot">
								<text>预约{{item.technicianNumberCount}}次</text>|
								<text>好评{{item.technicianScore}}分</text>
							</view>
						</view>
					</view>
					
					<view class="right-list">
						<text class="right-list-text1" @click="cancel(index)">取消</text>
						<text class="right-list-text2">接单</text>
					</view>
				</view>
			</view>
		</view>
		
		<uni-popup type="bottom" ref='cancel'>
			<view class="quxiao">
				<view class="title">取消订单</view>
				<view class="text1">取消订单将会影响个人信誉排名</view>
				<view class="text2">注：每日拒绝超过2次，平台将限制其未来24小时内不能再接单.</view>
				<view class="btn">
					<view class="cancel" @click="can">取消</view>
					<view class="quedin" @click="jieOk">确定</view>
				</view>
			</view>
			
		</uni-popup>
	</view>
</template>

<script>
	import {getDateAppointment,getAppointDateMessage,getTimeManagement,addCmsTimeManagement,setTodayTimeMessageClose,setTodayTimeMessageStart} from '@/api/index.js'
export default {
	data() {
		return {
			multiSelector: [
				['8:00','9:00', '10:00', '11:00', '12:00', '13:00', '14:00', '15:00', '16:00', '17:00', '18:00', '19:00', '20:00', '21:00','22:00','23:00','00:00'],
				['8:00','9:00', '10:00', '11:00', '12:00', '13:00', '14:00', '15:00', '16:00', '17:00', '18:00', '19:00', '20:00', '21:00','22:00','23:00','00:00']
			],
			show: false,
			show1: false,
			tim: '',//时间区域
			lists: ['1','2'],//休息的列表
			text: '未设置休息日 >',
			index:0,
			hide:false,
			hide1:true,
			list:[],
			active:0,
			time:'8:00-21:00',
			AppointmentList:[],//预约时间列表
			detailList:[],
			detailList2:[],
			hide2:false,
			hide3:false,
			checked:1,//控制滑块的状态
			day:'',//控制那一天休息
			year:''//当前月日年
		};
	},
	methods: {
		changed(e) {
			this.hide = true
			this.hide1=false
			this.hide2 = true
			this.active=0
			this.year = e.fulldate
			let that = this
			that.list.length = 0
			that.time = e.month + '-'+ e.date
			console.log(that.time);
			for(var i=0;i<7;i++)
			          {
			           var weekDayArr=["星期日","星期一","星期二","星期三","星期四","星期五","星期六"]//星期映射数组
			           var myDate = new Date(e.fulldate)
			           var milliseconds=myDate.getTime()+1000*60*60*24*i; //当i为0代表当前日期，为1时可以得到明天的日期，以此类推
			           var newMyDate = new Date(milliseconds);
			           var weekDay=newMyDate.getDay(); //获取当前星期X(0-6,0代表星期天)
			           var year = newMyDate.getFullYear();//获取当前年
			           var month = newMyDate.getMonth()+1;//获取当前月
			           var day = newMyDate.getDate();//获取当前日
			            // console.log(year+'/'+month+'/'+day+weekDayArr[weekDay])
						var obj = {
								years:month+'-'+day,
								years_more:month+'月'+day+'日',
								day:weekDayArr[weekDay],
								all:year + '-'+month +'-'+day
								}
								that.list.push(obj)
						}
						console.log(that.list)
			this.getList()
			this.getAppointDateMessageList(e.fulldate)
			          
		},
		// 点击切换月份
		closeBox(e){
			this.hide = false
			this.hide1=true
			this.hide2 = false
			// console.log(e)
		
		},
		//弹出选择时间
		pick() {
			this.show = true;
		},
		//弹出选择休息日期
		pick2() {
			this.show1 = true;
		},
		//修改选择时间
		getItem(e) {
			console.log(e);
			this.tim = this.multiSelector[0][e[0]] + '-' + this.multiSelector[1][e[1]];
		},
		//修改休息日期
		getItem2(e) {
			console.log(e);
			this.day  = this.lists[e[0]]
			this.text = '当前休息日为' + this.day + ' >';
		},
		//点击保存
		save(){
			let data ={
				managementOrderReceiving:this.checked,
				businessTime:this.tim,
				publicRest:this.day
			}
			this.AppointmentList.length = 0
			addCmsTimeManagement(data).then(res=>{
				if(res[1].data.message =='操作成功'){
					uni.redirectTo({
						url:'./index'
					})
				}
				
			})
			console.log(data)
		},
		//点击时间管理
		tbs(){
			this.index = 0
			this.hide3 = false
			this.hide2 = true
		},
		//点击今日预约
		tbs_now(){
			this.index = 1
			this.list.length = 0
			this.hide3 = true
			this.hide2 = false
			this.getTime()
			this.getList()
			this.getAppointDateMessageList(this.year)
		},
		//获取时间
		getTime(){
			for(var i=0;i<7;i++)
			          {
			           var weekDayArr=["星期日","星期一","星期二","星期三","星期四","星期五","星期六"]//星期映射数组
			           var myDate = new Date()
			           var milliseconds=myDate.getTime()+1000*60*60*24*i; //当i为0代表当前日期，为1时可以得到明天的日期，以此类推
			           var newMyDate = new Date(milliseconds);
			           var weekDay=newMyDate.getDay(); //获取当前星期X(0-6,0代表星期天)
			           var year = newMyDate.getFullYear();//获取当前年
			           var month = newMyDate.getMonth()+1;//获取当前月
			           var day = newMyDate.getDate();//获取当前日
			            // console.log(year+'/'+month+'/'+day+weekDayArr[weekDay])
						var obj = {
								years:month+'-'+day,
								years_more:month+'月'+day+'日',
								day:weekDayArr[weekDay],
								all:year + '-'+month +'-'+day
								}
								this.list.push(obj)
						}
						// this.list[0].day='今天'
						// this.list[1].day='明天'
						// this.list[2].day='后天'
						this.time = this.list[0].years.replace(/\//g,'-')
						this.year = this.list[0].all
		},
		getDay(y,index,item){
			console.log(item.all)
			this.year = item.all
			this.active = index
			let a = y.replace(/\//g,'-')
			this.time = a
			this.getList()
			this.getAppointDateMessageList(item.all)
			// console.log(this.time )
			
		
		},
		//点击关闭预约
		close(item){
			console.log(item)
			let that = this 
			let data ={
				all:that.year,
				time:item.times
			}
			if(item.status =='可预约'){
				uni.showModal({
				    title: '提示',
				    content: '是否关闭预约',
				    success: function (res) {
				        if (res.confirm) {
							//发送关闭请求
							
							console.log(data)
							setTodayTimeMessageClose(data).then(ress=>{
								console.log(ress)
								  item.status = '已关闭'
							}).catch(er=>{
								console.log(e)
							})
																	          
				        } else if (res.cancel) {
				            console.log('用户点击取消');
				        }
				    }
				});
				return 
			}
			if(item.status =='已关闭'){
				uni.showModal({
				    title: '提示',
				    content: '是否开启预约',
				    success: function (res) {
				        if (res.confirm) {
							// 发送开启请求
							setTodayTimeMessageStart(data).then(ress=>{
								
								
								item.status = '可预约'
							}).catch(errr=>{
								console.log(errr)
							})
				            
				        } else if (res.cancel) {
				            console.log('用户点击取消');
				        }
				    }
				});
				
			}
			
		},
		//获取列表数据
		getList(){
			let that =this
			uni.showToast({
				icon:"loading",
				duration:9999
			})
			// 获取预约列表
			getDateAppointment("9-30").then(res=>{
				if(res){
					uni.hideToast()
				}
				that.detailList = res[1].data.data
				that.detailList2 = res[1].data.data
				// console.log(that.detailList[0].orderCreateTime)
				
				console.log(that.detailList)
			}).catch(err=>{
				console.log(err)
			})
		},
		//点击取消
		cancel(index){
			this.$refs.cancel.open()
		},
		call(phone){
			uni.makePhoneCall({
			    phoneNumber: phone
			});
		},
		can(){
			this.$refs.cancel.close()
		},
		//接单确定
		jieOk(){
			this.$refs.cancel.close()
		},
		//获取预约时间段的列表
		getAppointDateMessageList(datas){
			let that = this
			let arr1=[]
			let data = datas
			getAppointDateMessage(data).then(res=>{
					if(res[1].data.data===null){
						that.AppointmentList=[]
						uni.showToast({
							title:'暂无数据',
							icon:'none'
						})
						return
					}
					let Can_appointment =  res[1].data.data.appointmentSure.split(',')
					
					let str = res[1].data.data.appointmentAlready +','+res[1].data.data.appointmentSure+','+res[1].data.data.appointmentClose
					// console.log(res[1].data.data.appointmentClose.split(','))
					
					let new_arr = str.split(',').sort()
					
					let a=[]
					if(res[1].data.data.appointmentClose!=null){
						let close = res[1].data.data.appointmentClose.split(',')
						
						for(let i=0;i<arr1.length;i++){
								for(let j = 0;j<close.length;j++){
									if(arr1[i].times==close[j]){
										arr1[i].status = '已关闭'							
								}
							}
						}
					
					}
						
					
					
					new_arr.map(x=>{
						if(x!='null'&&x!=''){
							a.push(x)
						}
					})
					console.log("======",a)
				for(let i = 0;i<a.length;i++){
					arr1.push({times:a[i],status:'已预约'})
				}
				
				for(let i=0;i<arr1.length;i++){
						for(let j = 0;j<Can_appointment.length;j++){
							if(arr1[i].times==Can_appointment[j]){
								arr1[i].status = '可预约'							
						}
					}
				}
				
				that.AppointmentList = arr1
			})
		},
		//获取时间管理相关信息
		getPageAppoint(){
			getTimeManagement().then(res=>{
				
				this.tim = res[1].data.data.businessTime
				this.lists = res[1].data.data.publicRest.split(',')
				this.change = res[1].data.data.managementOrderReceiving
				
			}).catch(err=>{
				
			})
		},
		//点击滑块
		switchChange(e){
			// console.log(e.target.value)
			this.change = e.target.value==true?1:0
			
			console.log(this.change)
		}
	},
	mounted() {
	
		this.getTime()
		this.getPageAppoint()
		
	
	
	},
	filters:{
		getHours(t){
			let hours = new Date(t).getUTCHours()
			let min = new Date(t).getMinutes().toString().padStart("2",0)
			let str = hours +':' + min
							
			return str
		}
	}
};
</script>

<style scoped lang="less">
.content {
	// padding-bottom: 157rpx;
	.head {
		display: flex;
		padding: 42rpx 25rpx;
		font-size: 36rpx;
		font-family: PingFang;
		font-weight: 500;
		color: #8a8a8a;
		line-height: 30rpx;
		align-items: center;
		view {
			margin-right: 69rpx;
		}
		// height: 25rpx;
		.time {
			font-size: 36rpx;
			font-family: PingFang;
			font-weight: bold;
			color: #00c6c2;
		}
	}
	.lis {
		font-size: 28rpx !important;
		font-family: PingFang SC;
		font-weight: 400;
		color: #282828;
		line-height: 28rpx;
	}
	.footer {
		.save {
			margin: 130rpx auto;
			width: 700rpx;
			height: 85rpx;
			// margin-bottom: 157rpx;
			background: #00c6c2;
			text-align: center;
			line-height: 85rpx;
			font-family: PingFang;
			font-weight: bold;
			color: #ffffff;
			font-size: 36rpx;
		}
	}
	//今日预约
	.now_time {
		height: 750rpx;
		margin-bottom: 10rpx;
	}
	
}

//日历
	
	.week_day{
		display: flex;
		justify-content: space-around;
		
		font-size: 26px;
		font-family: PingFang;
		font-weight: 500;
		color: #777777;
		line-height: 30px;
		background: white;
		.icons{
			
			font-size: 26rpx;
			font-family: PingFang;
			font-weight: bold;
			color: #000000;
			line-height: 30rpx;
			border-bottom: 4rpx solid #1EBBBD;
		}
		.week_time{
			
		
		font-size: 16rpx;
		font-family: PingFang;
		font-weight: 500;
		color: #777777;
		line-height: 30rpx;
		}
		.icon_time{
			font-size: 23rpx !important;
			color: #000000;
		}
	}
.infors{
		width:100%;
		height: 94%;
		padding-left: 27rpx;
		padding-right: 27rpx;
		position: relative;
		
		.boxs{
			width: 140rpx;
			height: 100rpx;
			display: inline-block;
			border: 1rpx solid #BFBFBF;
			border-radius: 4rpx;
			margin-right: 27rpx;
			margin-left: 10rpx;
			margin-top: 39rpx;
			text-align: center;
			font-size: 26rpx;
			font-family: PingFang;
			font-weight: 500;
			color: #777777;
			line-height: 36rpx;
		}
		.active{
			border: 1rpx solid #1EBBBD!important;
			color: #1EBBBD!important;
		}
	
	}	

.xx {
	position: relative;
	
}
.bb {
	width: 100%;
	height: 95%;
	// background-color: #00c6c2;
	background: white;
	position: absolute;
	top: 12%;
	left: 0;

	
}
.bott{
	padding-left: 27rpx;
	position: absolute;
	bottom: 12rpx;
	left: 0;
	.tishi{
		
		font-size: 24rpx;
		font-family: PingFang;
		font-weight: 500;
		color: #404040;
	}
	.text{
		
		font-size: 20rpx;
		font-family: PingFang SC;
		font-weight: 400;
		color: #707070;
	}
}



// 列表
	.list{
		height: 297rpx;
		background-color: white;
		margin-top: 29rpx;
		padding: 29rpx 27rpx;
		box-shadow: 0px 2rpx 6rpx 0rpx rgba(113, 113, 113, 0.26);
		.list_top{
			display: flex;
			align-items: center;
			border-bottom: 0.4rpx solid #E1E1E1;
			.list_left{
				.left_top{
					
					font-size: 30rpx;
					font-family: PingFang;
					font-weight: bold;
					color: #282828;
					line-height: 30rpx;
					.upTime{
						display: inline-block;
						width: 90rpx;
						background: #ECECEC;
						border-radius: 17rpx;
						text-align: center;
						line-height: 38rpx;
						margin-left: 20rpx;
						font-size: 17rpx;
						font-family: PingFang;
						font-weight: 500;
						color: #282828;
					}
				}
				.scrail1{
					display: inline-block;
					width: 10rpx;
					height: 10rpx;
					background: #00C6C2;
					border-radius: 50%;
					margin-right: 9rpx;
				}
				.scrail2{
					display: inline-block;
					width: 10rpx;
					height: 10rpx;
					background: black;
					border-radius: 50%;
					margin-right: 9rpx;
				}
				.public{
					
					font-size: 24rpx;
					font-family: PingFang;
					font-weight: bold;
					color: #414141;
					margin-right: 9rpx;
				}
				.public_text{
					font-size: 24rpx;
					font-family: PingFang;
					color: #414141;
					line-height: 30rpx;
				}
			}
			.list_right{
				// width: 100%;
				flex: 1;
				display: flex;
				flex-direction: column;			
				align-items: flex-end;
				justify-content: space-between;				
				.iconfont{
					font-size:60rpx ;
					color:#9f9f9f;
				}
				.log{
					font-size: 22rpx;
					color: #000000;
					font-family:PingFang-SC-Regular;
				}
				.price{					
					font-size: 40rpx;
					font-family: PingFang SC;
					font-weight: 400;
					color: #000000;
				}
			}
		}
		.list_botom{
			padding:22rpx 0 0 0;
			display: flex;
			align-items:flex-end;
			justify-content: space-between;
			
			.list-bot-left{
				display: flex;
				justify-content: space-between;
				align-items: center;
				.imgs{
					flex: 1;
					margin-right: 15rpx;
				}
				
				.list-con{							
					.list-con-top{
						
						text{
							display: inline-block;
							
							font-size: 24rpx;
							font-family: PingFang;
							font-weight: 500;
							color: #333333;
							line-height: 30rpx;
						}
						.mei{
							// width: 62rpx;
							height: 24rpx;
							background: #000000;
							border-radius: 4rpx;
							text-align: center;
							line-height: 24rpx;
							font-size: 16rpx;
							font-family: PingFang;
							font-weight: 500;
							color: #F0D9A9;
							// line-height: 30px;
							margin-left: 24rpx;
						}
						.shi{
							width: 75rpx;
							height: 24rpx;
							background: #F1F1F1;
							border-radius: 4px;
							line-height: 24rpx;
							text-align: center;
							margin-left: 24rpx;
							font-size: 16rpx;
							font-family: PingFang;
							font-weight: 500;
							color: #A5A0A0;
							line-height: 30rpx;
						}
					}
					.list-con-bot{
						display: inline-block;
						font-size: 18rpx;
						font-family: PingFang;
						font-weight: 500;
						color: #777777;
						line-height: 30rpx;
					}
				
				}
			}
			.right-list{
				display: flex;
				flex: 2;				
				justify-content: flex-end;
				justify-content:;
				text{
					display: inline-block;
				}
				.right-list-text1{
					width: 106rpx;
					height: 58rpx;
					border: 1rpx solid #979797;
					border-radius: 4rpx;
					text-align: center;
					line-height: 58rpx;
					color: #979797;
					font-size: 30rpx;
					font-family: PingFang;
					font-weight: 500;
					margin-right: 24rpx;
				}
				.right-list-text2{					
					width: 141rpx;
					height: 58rpx;
					background: #00C6C2;
					border-radius: 4rpx;
					text-align: center;
					line-height: 58rpx;					
					font-size: 30rpx;
					font-family: PingFang;
					font-weight: 500;
					color: #FFFFFF;
				}
			}
		}
	}
	//取消
	.quxiao{
		width: 100%;
		height: 800rpx;
		background: white;
		text-align: center;
		.title{
			height: 100rpx;
			border-bottom: 1rpx #E0E0E0 solid;
			font-size: 30rpx;
			font-family: PingFang;
			font-weight: bold;
			color: #282828;
			line-height: 30rpx;
			text-align: center;
			line-height:100rpx ;
		}
		.text1{
			margin-top: 49rpx;
			margin-bottom: 49rpx;
			font-size: 32rpx;
			font-family: PingFang SC;
			font-weight: 400;
			color: #282828;
		}
		.text2{
			width: 445rpx;
			height: 59rpx;
			font-size: 24rpx;
			font-family: PingFang SC;
			font-weight: 400;
			color: #515151;
			line-height: 36rpx;
			margin: 0 auto;
			margin-bottom: 49rpx;
		}
		.btn{
			margin: 0 auto;
			width: 452rpx;
			height: 67rpx;
			display: flex;
			justify-content: space-between;
			.cancel{
				width: 227rpx;
				height: 67rpx;
				background: #00C6C2;
				text-align: center;
				line-height: 67rpx;
				border: 1rpx solid #A5A0A0;
				font-size: 30rpx;
				font-family: PingFang;
				font-weight: 500;
				color: #FFFFFF;
			}
			.quedin{
				width: 227rpx;
				height: 67rpx;
				border: 1rpx solid #A5A0A0;
				line-height: 67rpx;
				font-size: 30rpx;
				font-family: PingFang;
				font-weight: 500;
				color: #414141;
			}
		}
	}
</style>
